import {lazy} from 'react'
import {createBrowserRouter} from 'react-router-dom'
import {
  DesktopOutlined,
  FileOutlined,
  PieChartOutlined,
  TeamOutlined,
  UserOutlined,
} from '@ant-design/icons';
import Home from '../pages/home/Index'
import Login from '../pages/login/Index'
import Error from '../pages/404/Index'

let Index=lazy(()=>import('../pages/index/Index'))
let List=lazy(()=>import('../pages/list/Index'))
let User=lazy(()=>import('../pages/user/Index'))

export const otherRouters=[
   {
        path:'/home/index',
        element:<Index></Index>,
        title:'首页',
        icon:<DesktopOutlined/>
   },
    
     
]

let allRoutes={
    list: {
        path:'/home/list',
        element:<List></List>,
        title:'列表管理',
        icon:<FileOutlined/>
   },
   user:{
        path:'/home/user',
        element:<User></User>,
        title:'用户管理',
        icon:<PieChartOutlined/>
   }
}

let allRoles={
    admin:{
        myRoutes:['list','user'],
        btns:{
            user:['view','edit','del','add']
        }
    },
    user:{
        myRoutes:['user'],
         btns:{
            user:['view']
        }
    },
}

let {myRoutes,btns}=allRoles['admin']
myRoutes && myRoutes.forEach(item=>{
    otherRouters.push({
        ...allRoutes[item],
        loader:()=>({btn:btns[item]})
    })
})


let routes = createBrowserRouter([
    {
        path:'/home',
        element:<Home></Home>,
        children:otherRouters
    },
    {
        path:'/login',
        element:<Login></Login>
    },
    {
        path:'*',
        element:<Error></Error>
    }
])

export default routes